<template>
  <div class="home-weekend">
    <h3 class="weekend-title">周末去哪</h3>
    <div class="weekend-content">
      <div class="content-item border-bottom"
        v-for="item of info"
        :key="item.id">
        <div class="img-wrapper">
          <img :src="item.imgUrl" alt="" class="img">
        </div>
        <div class="site-name">{{item.title}}</div>
        <div class="site-desc">{{item.desc}}</div>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  name: 'homeWeekend',
  props: {
    info: Array
  }
}
</script>
<style lang="stylus" scoped>
.home-weekend
  width 100%
  margin-top 10px
  .weekend-title
    background #bbb
    line-height 1.5
    padding-left 10px
    color #fff
    font-size 20px
  .weekend-content
    .content-item
      padding-bottom 20px
      font-size 20px
      .img-wrapper
        width 100%
        height 0
        padding-bottom 37.09%
        margin-bottom 10px
        .img
          width 100%
      .site-name
        padding-left 10px
        padding-bottom 8px
      .site-desc
        padding-left 10px
        color #bbb

</style>
